<template>
  <div>
    <p class="title">文章统计图</p>
    <div class="chart" v-if="Object.keys(data).length != 0">
      <brokenLine :data="data.dateTime"></brokenLine>
      <circular :data="data.articleNume"></circular>
      <column></column>
    </div>
  </div>
</template>
<script>
import brokenLine from "./brokenLine.vue";
import circular from "./circular.vue";
import column from "./column.vue";

export default {
  name: "chart",
  props: {
    data: {
      type: Object,
      default() {
        return {};
      },
    },
  },
  data() {
    return {
      link: {},
    };
  },
  components: { brokenLine, circular, column },
};
</script>
<style scoped>
.title{
  text-align: center;
  color: rgb(54, 54, 54);
  font-size: 29px;
  font-weight: 500;
  margin-bottom: 50px;
}
.chart {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  justify-content: space-between;
  padding: 0px 30px;
}
</style>